<!DOCTYPE html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div id="div">
        <div>姓名：{{name}}</div>
        <div>班级：{{classRoom}}</div>
        <button v-on:click="hi()">打招呼</button>
        <button @click="update">修改班级</button>
        <input type="text" @focus="getFocus()"/>
    </div>
<script src="js/vue.js"></script>
<script >
    let vm = new Vue({
        el:'#div',
        data:{
            name:'张三',
            classRoom: '黑马程序员'
        },
        methods:{
            hi(){
                alert("hello");
            },
            update(){
                alert("say update");
            },
            getFocus(){
                alert("获取焦点");
            },
            study(){
                console.log('------'+this.name);
            }
    }
    });
</script>
</body>
</html>